<template>
    <div class="basic-container">
        <div class="settle-box">
            <div class="box" :style="style">
                <router-view @change="changeView"></router-view>
            </div>
            <!--            <div class="techSupport">杭州数动云提供技术支持</div>-->
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                style: {backgroundColor: '#f4f4f4'}
            }
        },
        mounted() {
            // this.rest()
        },
        // watch: {
        //     '$route'(to, from) {
        //         // 路由变化，更改页面基础样式
        //         this.rest()
        //     }
        // },
        methods: {
            changeView(obj) {
                if (obj.style) this.style = {...this.style, ...obj.style}
            },
            rest() {
                this.style = {backgroundColor: '#f4f4f4'}
            }
        },
        components: {},
        // beforeRouteLeave(to, from, next) {
        //     this.rest()
        //     next()
        // },
        beforeRouteUpdate(to, from, next) {
            this.rest()
            next()
        }
    }
</script>

<style scoped lang="less">
    .basic-container, .settle-box {
        height: 100%;
        width: 100%;
        overflow: hidden;
    }

    .settle-box {
        overflow-y: auto;

        .box {
            width: 100%;
            min-height: 100%;
            overflow-x: hidden;
            /*padding-bottom: .6rem;*/
        }
    }

    .techSupport {
        width: 100%;
        height: .6rem;
        line-height: .6rem;
        text-align: center;
        color: #999;
        font-size: .24rem;
        margin-top: -.6rem;
        position: relative;
        z-index: 1;
    }
</style>
